<template>
	<view class="page__content">
		<up-navbar title="工作台" :autoBack="true" :fixed="false" :safeAreaInsetTop="true" />

		<view class="page__content__main">
			<uni-row class="module-grid" :gutter="20">
				<uni-col v-for="(item, index) in inspectionModuleList" :key="index" :span="8" :xs="{ span: 8 }"
					:sm="{ span: 4 }" :lg="{ span: 3 }">
					<view class="module-card" @click="handleModuleClick(item)">
						<uni-icons fontFamily="CustomFontPlatform" :color="item.AP_Colour" :size="40">
							{{ uni.$utils.toUniCode(item.PIC_PH) }}
						</uni-icons>

						<view class="module-card__title">
							<text>{{ item.APFunName }}</text>
						</view>
					</view>
				</uni-col>

				<!-- <uni-col :span="8" :xs="{ span: 8 }" :sm="{ span: 4 }" :lg="{ span: 3 }">
					<view class="module-card" @click="openBlueTooth">


						<view class="module-card__title">
							<text>测试蓝牙</text>
						</view>
					</view>
				</uni-col> -->
			</uni-row>
		</view>
	</view>
</template>

<script setup lang="ts">
	import { computed } from 'vue'
	import { useMainStore, useQmsStore, usePermissionStore, useUserStore } from '@/store'
	import useRequestQueue from '@/uni_modules/mc-ui/libs/http/UniversalRequestQueue'

	const qmsStore = useQmsStore()
	const mainStore = useMainStore()
	const permissionStore = usePermissionStore()
	const userStore = useUserStore()

	const { request, requestByUrl, onAllComplete, onError } = useRequestQueue()

	// 清理缓存
	uni.removeStorageSync('OrderUrl')
	// uni.removeStorageSync('OrderID')

	// 工作台模块数据
	const inspectionModuleList = computed(() =>
		(permissionStore.moduleInfoAll ?? [])
			.filter(module => !module.IsTabbar)
			.flatMap(module => (module.Node ?? []).filter(node => !node.IsTabbar))
			.sort((a, b) => Number(a.APFunCode) - Number(b.APFunCode))
	)

	console.log(inspectionModuleList.value)

	const openBlueTooth = () => {
		uni.navigateTo({
			url: "/st_qms/page-workbench/Bluetooth_test/Bluetooth_test"
		})
	}

	// 点击模块卡片
	const handleModuleClick = (module : any) => {
		// uni.setStorageSync('OrderID', module.APPFunID)
		qmsStore.orderConfig.order_info = module;
		uni.hideToast()

		const navigate = (url : string) => {
			setTimeout(() => {
				uni.navigateTo({ url })
			}, 300)
		}
		console.log(module.AP_Link);

		const mapPath = uni.$utils.replaceDispatchPath(module.AP_Link);
		console.log(mapPath);

		if (mapPath.includes('.html')) {
			// 横屏模式
			plus.screen.lockOrientation('landscape-primary')
			navigate('/st_qms/page_webview/webview_basic')
		} else {
			navigate(mapPath)
		}
	}
</script>

<style lang="scss">
	.page__content {
		height: 100vh;
		background-color: #f9f9f9;

		&__main {
			padding: 20rpx;
		}

		.module-grid {
			display: flex;
			flex-wrap: wrap;
		}

		.module-card {

			width: 100%;
			background-color: #fff;
			border-radius: 20rpx;
			display: flex;
			flex-direction: column;
			align-items: center;
			justify-content: center;
			padding: 40rpx 0;
			transition: all 0.25s ease;
			box-shadow: 0 2rpx 10rpx rgba(0, 0, 0, 0.04);
			position: relative;
			overflow: hidden;
			margin-bottom: 20rpx;

			// 动态渐变背景遮罩（让颜色更柔和）
			&::before {
				content: '';
				position: absolute;
				inset: 0;
				border-radius: inherit;
				background: var(--module-bg);
				opacity: 0.08;
				pointer-events: none;
			}

			&:active {
				transform: scale(0.96);
				box-shadow: 0 4rpx 12rpx rgba(0, 0, 0, 0.1);
			}

			&__title {
				text-align: center;
				margin-top: 12rpx;
				font-size: 24rpx;
				color: #333;
				font-weight: 500;
			}
		}
	}
</style>